import React, { useState, useEffect, useRef } from 'react'


// 自定义hooks-封装倒计时-需求-404页面3秒跳转 百度
export default function HooksNotFound () {

    const [count, setCount] = useState(3)
    const timerId = useRef(null)


    useEffect(() => {

        timerId.current = setInterval(() => {
            setCount((count) => count - 1)

        }, 1000);

    }, [])

    // useEffect(() => {
    //     console.log('1', count)
    //     return () => {
    //         console.log('2', count)

    //         if (count === 0) {

    //             clearInterval(timerId.current)
    //             window.location.href = 'http://www.baidu.com'
    //         }

    //     }
    // }, [count])  // 有bug 

    useEffect(() => {
        console.log('2', count)
        if (count === 0) {
            clearInterval(timerId.current)
            window.location.href = 'http://www.baidu.com'
        }
    }
        , [count])



    return (
        <div>HooksNotFound


            <div>
                你要的页面不存在，{count}秒之后，自动跳到主页。或者点击<a href="http://www.baidu.com">这里</a>跳转
            </div>

        </div>
    )
}
